<template>
	<view class="my">
	<!-- 	nickName: "时光恰如年。"
		gender: 1
		language: "zh_CN"
		city: "Wuhan"
		province: "Hubei"
		country: "China"
		avatarUrl: "https://thirdwx.qlogo.cn/mmopen/vi_32/cia1WQmUrx82MicBEpQejwn88QBFCf8XnuTKZYP8M
		我是 my界面 -->
	  <view class="top">
		   <view class="top_left">
		   	<view class="top_txt1">
		   		  天下第一吃货
		   	</view>
		   	<view class="top_txt2">
		   				   欢迎光临四海香
		   	</view>
		   </view>
		  	<image  class="top_right" :src="info.avatarUrl"></image>
	  </view>
		  <view class="bottom_list">
			  
			  <navigator url="/pages/tousu/tousu" class="list_item">
				  <image class="image" src="../../static/image/footer3-sel.png"></image>
			  		 <text class="txt"> 烹饪历史</text>
			  </navigator>
			  <navigator url="/pages/tousu/tousu"  class="list_item">
			  				  <image class="image" src="../../static/image/icon_money.png"></image>
			  		 <text class="txt"> 支付记录</text>
			  </navigator>
			  <navigator url="/pages/tousu/tousu"  class="list_item">
			  				  <image class="image" src="../../static/image/icon_msg.png"></image>
           <text class="txt"> 举报投诉</text>
			  </navigator>
		  </view>
	
	</view>
</template>

<script>
	export default {
		data(){
			return{
				info:{}
			}
			},
		
	  created(){
		  // const self=this
		  uni.getStorage({
		      key: 'userinfo',
		      success:  (res)=> {
		          console.log(res.data);
				  this.info=res.data
		      }
		  });
	  }
	
		
	}
</script>

<style lang="less" scoped>
	.my{
		padding: 0px  15px ;
		box-sizing: border-box;
	}
	.top{
		display: flex;
		align-items: center;
		justify-content: space-between;
		
		padding: 20px 0px;
		box-sizing: border-box;
		border-bottom: 1px solid #ccc;
	}
	.top_right{
		height: 60px;
		width: 60px;
		border-radius: 50%;
		box-shadow: 0px 0px 8px skyblue;
	}
	.bottom_list{
		.list_item {
			
			display: flex;
			padding: 15px 0px;
			border-bottom: 1px solid #e4e4e4;
			.txt{
				margin-left: 8px;
			}
			.image{
				width: 25px;
				height: 25px;
			}
		}
	}
</style>
